<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css" media="screen">
		*{
			margin: 0;
			padding: 0;
			position: relative;
		}
	
		#one_1{
			background-color: rgba(34,35,36,0.85);
		}
		#one{
			width:100%;
		   height:84px;
		}
		table{
			text-align: center;
			line-height: 1px;
   			width: 100%;
   			background-color: rgba(34,35,36,0.85);
   			/*background-color: #2d2e2f\9;*/
   			position: fixed;
    		top: 0;
		    left: 0;
		    z-index: 200;
		    font-family: "Microsoft Yahei";
		    border-spacing: 40px;
		    box-shadow:1px 1px 1px rgba(0,0,0,.3);
		}
		a{
			text-decoration: none;
		}
		#two_li>a{
			color:white;
			font-size: 20px;
		}
		#two_li>a:hover{
			color:yellow;
		}
		#two{
			position: relative;
			width: 100%;
			height:1250px;
			background-color: rgba(34,35,36,0.35);
		}
		#two_left{
			position: absolute;
			width: 250px;
			height:300px;
			margin: auto black 5px;
			top: 0;
			left: 14%;
			/*不兼容IE10以下及火狐3以下;params:水平偏移 垂直偏移 模糊距离 颜色*/
			box-shadow:1px 1px 1px rgba(0,0,0,.3);
			background-color:white;
		}
	
		#two_left_one{
			    width: 100px;
			    height: 80px;
			    position: absolute;
			    left: 20%;
			    top:0;
			    z-index: 20;
			    border-radius: 120px;
			    /*background-color: red;*/
		}
		#two_left_head_headed{
			    width: 100px;
			    height: 100px;
			    position: absolute;
			    left: 20%;
			    top:0;
			    z-index: 20;
			    border-radius: 120px;
			    background-color: yellow;
		}
		#two_left_two{
			top:50%;
		    height: 100px;
		    padding: 15px;
		    background-color: #efefef;
		    line-height: 50px;
		    color: #999;
		    border-style: none;
		    display: block;
		    width: 215px;
		    border: #efefef 1px solid;
		    font-size: 14px;
		    resize: none;
		    transition: .3s ease-out 0s;
		    -webkit-transition: .3s ease-out 0s;
		}
		#textarea{
			width: 200px;
			height:100px;
			margin:auto;
		}
		#two_left1{
			position: absolute;
			width: 250px;
			height:300px;
			margin: auto black 5px;
			top: 301px;
			left: 14%;
			/*不兼容IE10以下及火狐3以下;params:水平偏移 垂直偏移 模糊距离 颜色*/
			box-shadow:1px 1px 1px rgba(0,0,0,.3);
			background-color:white;
		}
		#two_right{
			position: relative;
			width: 53%;
			height:140px;
			margin:auto black 5px;
			top:1px;
			left:34%;
			background-color:white;

		}
		#two_right1{
			position: absolute;
			width: 53%;
			height:320px;
			margin:auto black 5px;
			top:192px;
			left:34%;
			background-color:white;
		}
		#two_right2{
			position: absolute;
			width: 53%;
			height:320px;
			margin:auto black 5px;
			top:543px;
			left:34%;
			background-color:white;
		}
		#two_right3{
			position: absolute;
			width: 53%;
			height:320px;
			margin:auto black 5px;
			top:894px;
			left:34%;
			background-color:white;
		}
		#three{
			width: 100%;
			height:150px;
			background-color: rgba(34,35,36,0.95);
		}
		#two_right_one{
			text-align: center;
			position:absolute;
			width: 15%;
			height:80px;
			margin:auto black 5px;
			top:15px;
			left:7%;
			/*background-color: green;*/
		}
		#two_right_two{
			text-align: center;
			position:absolute;
			width: 15%;
			height:80px;
			margin:auto black 5px;
			top:15px;
			left:29%;
			/*background-color: green;*/
		}
		#two_right_three{
			text-align: center;
			position:absolute;
			width: 15%;
			height:80px;
			margin:auto black 5px;
			top:15px;
			left:54%;
			/*background-color: green;*/
		}
		#two_right_four{
			text-align: center;
			position:absolute;
			width: 15%;
			height:80px;
			margin:auto black 5px;
			top:15px;
			left:76%;
			/*background-color: green;*/
		}
		#two_wright1_but{
			position: absolute;
			margin:auto black 5px;
			top:0px;
			right:5px;
			width: 80px;
			height:40px;
			color: white;
			background-color: rgba(34,35,36,0.55);
		}
		#two_wright1_but:hover{
			background-color:yellow;
		}
		#two_right1_yj{
			margin-top:10px;
			margin-left: 10px;
			width: 80px;
			line-height:40px;
			text-align: center;
			font-size: 16px;
			background-color: gray;
		}
		#two_right1_lie{
			margin-top:5px;
			width: 100%;
			line-height:40px;
			background-color: gray;
			text-align: center;
		}
		#two_right1_content{
			font-family: "Microsoft Yahei";
			margin-top: 10px;
			margin-left:2.5%;
			width: 95%;
			height:250px;
			background-color: gray;
		}
		#textarea{
			margin:auto;
			width: 200px;
			height:80px;
			/*background-color: gray;*/
		}
		#sub{
			margin:solid 5px;
			top:-30px;
			/*left: 70%;*/
			width: 94%;
			line-height: 20px;
			/*background-color:red;*/
		}
	</style>
</head>
<body>
	<div id="one_1"></div>
	<div id="one">
		<table>
			<tr>
				<td id="two_li"><a href="/test/testheader">首&nbsp;&nbsp;&nbsp;页</a></td>
				<td id="two_li"><a href="/test/test">我的小窝</a></td>
				<td id="two_li"><a href="">我的游记</a></td>
				<td id="two_li"><a href="">我的足迹</a></td>
				<td id="two_li"><a href="">我的问答</a></td>
				<td id="two_li"><a href="">我的结伴</a></td>
				<td id="two_li"><a href="#">更&nbsp;&nbsp;&nbsp;多</a></td>
			</tr>
		</table>
	</div>

	<div id="two">

		<div id="two_left">
				<div id="two_left_one">
					<a href="" id="two_left_head_headed"></a>
				</div>
				<div id="two_left_two">
					<textarea id="textarea" placeholder="潜水爱好者，摄影师..."></textarea>
					<input type="submit" value="保存" id="sub">
				</div>
		</div>
	

		<div id="two_left1">
			
		</div>
		<div id="two_right">
			<div id="two_right_one">
				<a href=""><img src="../img/15343534975731.jpg" width="100%" height="100%" alt=""></a>
				<a href="">写游记</a></div>
			<div id="two_right_two"><a href="">
				<img src="../img/15343534818864.jpg" width="100%" height="100%" alt="">
				</a><a href="">问达人</a>
			</div>
			<div id="two_right_three">
				<a href=""><img src="../img/15343553012373.jpg" width="100%" height="100%" alt="">
				</a><a href="">添加足迹</a>
			</div>
			<div id="two_right_four">
				<a href=""><img src="../img/15343797745875.jpg" width="100%" height="100%" alt=""></a>
				<a href="">发布结伴</a>
			</div>
		</div>
        <div id="two_right1">

        	<div id="two_right1_lie">
				<div id="two_right1_yj"><h3>我的游记</h3></div>
	
				<p id="two_wright1_but"><a href="/test/person">写游记</a></p>
			</div>
			<div id="two_right1_content">
				
			</div>
		</div>
		<div id="two_right2">
			<div id="two_right1_lie">
				<div id="two_right1_yj"><h3>我的回答</h3></div>
			</div>
		</div>
		<div id="two_right3">
			<div id="two_right1_lie">
				<div id="two_right1_yj"><h3>我的点评</h3></div>
			</div>
		</div>
		
	</div>
<div id="three">
		
		</div> 
	
</body>
</html>